{extend name="layout/tpl" /}
{block name="title"}{$title ?? ''}{/block}
{block name="css"}
{__block__}
<style type="text/css">
	.layui-col-sm20{
		width:20%;
		float: left;
	}
	h3{font-weight: 700;
		text-align: center;}
	.newListTableBg{    margin-top: 0px;}
	.newCommonListStyle{
		width:100%;
		min-width: 100%;
		margin-left: 0;
	}
	.newCommonListStyle .newListTableBg {
		padding-left: 10px;
		padding-right: 0;
		padding-top: 30px;
	}
	#list{width: 100%;text-align: left;}
	#list th{
		padding: 15px 15px 15px 0;
		font-size: 16px;
	}
	#list div.line{margin-bottom: 20px;}
	#list .team{margin-left: 15px;}
	#list .team a{color: #666666;}
	#list .match_time{font-weight: bold;}
	#list .score{font-weight: bold;}
	#list .score-gray{color: gray;}
	#list .score-red{color: #ff3d3d;}
	#list .score-brown{color: brown;}
	#list .score-blue{color: blue;}
	#list .score-green{color: #229c1d;}
	#list .date{padding: 5px;}
</style>
{/block}
{block name="content"}
{__block__}
<div class="newCommonListStyle">
	<div class="fixedTop">
		<div class="writeBgBlock">
			<h3 class="titleHeader" style="">{$name ?? '' }</h3>
		</div>
	</div>
	<div class="weadmin-body layui-fluid" style="display: none;">
		<form class="layui-form" action="">
		</form>
		<div class="clear"></div>
	</div>

	<div class="newListTableBg"  style="width: auto;">
		<table id="list" page="1">
			<thead>
			</thead>
			<tbody></tbody>
		</table>
		<div id="btn-next" style="text-align: center;"><button type="button" class="layui-btn search-btn layui-btn-xs" onclick="getList();" >下一页</button></div>
	</div>

	<script type="text/html" id="toolbar">
		<div class="weadmin-block" >

		</div>
	</script>

</div>

<script type="text/html" id="first_half_score">
	<span>{{d.first_half_score}}</span><span>（{{d.first_half_dx}}）</span>
</script>
<script type="text/html" id="second_half_score">
	<span>{{d.second_half_score}}</span><span>（{{d.second_half_dx}}）</span>
</script>
<script type="text/html" id="full_score">
	<span>{{d.full_score}}</span><span>（{{d.full_dx}}）</span>
</script>

{/block}

{block name="footerjs"}
{__block__}
<script src="/static/js/score.js?v={$version}"></script>
<script>
	getList = function () {
		var form = layui.form;
		var laypage = layui.laypage //分页
				,table = layui.table //表格
				,laydate = layui.laydate//日期
				,$ = layui.$
		;
		laydate.render({
			elem: '#match_time_start'
		});
		laydate.render({
			elem: '#match_time_end'
		});

		laydate.render({
			elem: '#match_time'
			,type: 'datetime'
			,range: '~'
		});

		//执行一个 table 实例
		var param = arrayToObject($('form').serializeArray());
		param['page'] = $('#list').attr('page');
		param['per_page'] = 100;
		param['list_formate'] = 2;
		if( '{:input("match_time") }' ) param['match_time'] = '{:input("match_time") }';
		if( '{:input("team_id") }' ) param['team_id'] = '{:input("team_id",0) }';
		if( '{:input("main_team_id") }' && '{:input("visiting_team_id") }' ) param['main_team_id'] = '{:input("main_team_id",0) },{:input("visiting_team_id",0) }';
		if( '{:input("main_team_id") }' && '{:input("visiting_team_id") }' ) param['visiting_team_id'] = '{:input("main_team_id",0) },{:input("visiting_team_id",0) }';

		var url = '{$indexUrl}';
		var index;
		$.ajax({
			type:    'post',
			url:     url,
			data:    param,
			dataType:'json',
			beforeSend:function () {
				index = layer.load(0, {shade: false});
			},
			success:    function (result) {
				layer.close(index);
				var data = result.data.list;
				var html = '';
				for(var d in data){
					html += '<tr>';
					// html += '<td><span class="date">' + d + '</span></td>';
					html += '<td>';
					for(var j in data[d]){

						if( typeof data[d][j] != 'undefined'){
							for(var i in data[d][j]){
								var item = data[d][j];
								html += '<div class="line">';
								html += '<div><em class="match_time">' + item[i].match_time + '</em>';
								html += '<span class="team">' +
										'<a target="_blank" href="?match_time=&team_id=' + item[i].main_team_id + '&title=' + item[i].main_team + '">' + item[i].main_team + '</a>' +
										'<a target="_blank" href="?match_time=&main_team_id=' + item[i].main_team_id + ','+ item[i].visiting_team_id +'&visiting_team_id=' + item[i].main_team_id + ','+ item[i].visiting_team_id + '&title=' + item[i].main_team + '~' + item[i].visiting_team  + '"> ~ </a>' +
										'<a target="_blank" href="?match_time=&team_id=' + item[i].visiting_team_id  + '&title=' + item[i].visiting_team  + '">' + item[i].visiting_team + '</a>' +
										'</span>' +
										'</div>';

								html += '<div class="score">' +
										'<span class="' + getColor(item[i].first_half_dx,0) + '"> ( ' + item[i].first_half_score + ' ) </span>' +
										'<span class="">&nbsp;&nbsp;</span>' +
										'<span class="' + getColor(item[i].first_half_dx,0) + '"> ( ' + item[i].first_half_dx + ' ) </span>' +

										'<span class="">&nbsp;&nbsp;|&nbsp;&nbsp;</span>' +

										'<span class="' + getColor(item[i].second_half_dx,0) + '"> ( ' + item[i].second_half_score + ' ) </span>' +
										'<span class="">&nbsp;&nbsp;</span>' +
										'<span class="' + getColor(item[i].second_half_dx,0) + '"> ( ' + item[i].second_half_dx + ' ) </span>' +

										'<span class="">&nbsp;&nbsp;|&nbsp;&nbsp;</span>' +

										'<span class=""> ( ' + item[i].full_score + ' ) </span>' +
										'<span class="">&nbsp;&nbsp;</span>' +
										'<span class="' + getColor(item[i].full_dx,1) + '"> ( ' + item[i].full_dx + ' ) </span>';

								if(item[i].remark != '') html += '<span class=""><i data-tips="' + item[i].remark +'" class="layui-icon">&#xe702;</i></span>';
								html += '</div>';

								// html += '<div class="score">' + item[i].score + '&nbsp;&nbsp;|&nbsp;&nbsp;' + item[i].da_xi + '</div>';

								html += '</div>';
							}
						}

					}
					html += '</td>';
					html += '</tr>';
					html += '<tr><td colspan="10"><hr /></td></tr>'
				}
				;
				$('#list>tbody').append(html);

				$('#list').attr('page',result.page + 1);
				if( result.page >= result.last_page ) $('#btn-next').hide();
			}
		});

	}

	layui.use(['laypage','table','form','laydate','soulTable'], function () {
		var form = layui.form
				,laypage = layui.laypage //分页
				,table = layui.table //表格
				,laydate = layui.laydate//日期
				,$ = layui.$
		;
		if(typeof getList == 'function') getList();
		form.on('submit(submit)',function(data){
			getList();
			return false;   // 阻止表单跳转
		});
	});

	$(document).ready(function () {
	});
	//回车进行搜索
	$(document).keydown(function(event){
		if(event.keyCode==13){
			$('button[data-type="search"]').click();
		}
	});

</script>
{/block}
